import { CloseOutlined } from '@ant-design/icons';
import { Button, Space, Tabs, Modal } from 'antd';
import { useState, useEffect } from 'react'
import JcyjApi from '../../../../../../../utils/apis/JcyjApi';
import TypeList from '../TypeList';
import YuJingXiaoXi from '../Yu_Jing_Xiao_Xi';
import './index.less'
import Yujinmsg from '../../Yujinmsg';
import InfoFeedback from '../InfoFeedback';
import DangerReport from '../DangerReport';
import useMap from '../../hooks/useMap';
export default function MoreInfo(props) {

    const { setCurrentDelItem, currentDelItem, setData, data } = props
    const [warningTypes, setWariningTypes] = useState([{
        name: '洪涝',
    }, {
        name: '地震',
    }, {
        name: '地灾',
    }, {
        name: '火灾',
    }])
    // const [warningTypes, setWariningTypes] = useState([{

    //     name: '@',
    // }])
    const [activeKey, setActiveKey] = useState('洪涝');
    const [waringItems, setWaringItems] = useState({});
    const [open, setOpen] = useState(false);
    const [Modalopen, setModalOpen] = useState(false);
    //2024.1.30，这行代码对我造成了影响，原来似乎是注释者的，
    // useEffect(() => {
    //     JcyjApi.yjMore().then(resp => {
    //         setWariningTypes(resp.data);
    //         setActiveKey(resp.data?.[0]?.id);
    //     })
    // }, [])
    const map = useMap();


    return <>

        <div className='msg-more-info'>
            <Tabs activeKey={activeKey} onChange={(key) => {
                setActiveKey(key);
            }} type="card">
                {warningTypes.map(item => {
                    return <Tabs.TabPane tab={item.name + '预警'} key={item.name} >
                        <TypeList typeId={item.name} typeName={item.name} currentDelItem={currentDelItem} setCurrentDelItem={setCurrentDelItem} setData={setData} data={data} />
                    </Tabs.TabPane>
                })}
            </Tabs>
            <div className='more-info-close' title='关闭' onClick={e => props.onClose?.()}>
                <CloseOutlined />
            </div>
            <div className='more-info-action'>
                <Space>
                    {/* <InfoFeedback /> */}
                    {/* <Button size="small" type="primary" onClick={e => {
                        setModalOpen(true)
                    }}>预警信息</Button> */}
                    {/* <DangerReport currentDelItem={currentDelItem} setCurrentDelItem={setCurrentDelItem} /> */}
                    <Button size="small" type="primary" onClick={e => {
                        // props.onTjfx?.(activeKey)
                        // setOpen(true)
                        map.dispatchEvent({
                            type: 'detail.show',
                            title: activeKey,
                            component: <Yujinmsg activeKey={activeKey} />
                        })
                    }}>统计分析</Button>
                </Space>

            </div>

            <div style={{
                position: 'absolute',
                top: -75,
                bottom: 0,
                right: -400,
                height: '265%'
            }}>
                {open && <Yujinmsg activeKey={activeKey} setOpen={setOpen} />}
            </div>

        </div>

        <Modal
            wrapClassName='modal-main'
            title="预警信息"
            open={Modalopen}
            onOk={e => {
                setModalOpen(false)
            }}
            onCancel={e => {
                setModalOpen(false)
            }}
            width={800}
            bodyStyle={{
            }}
        >
            <YuJingXiaoXi />
        </Modal>
    </>
}